:root {
  --menu-background: #304156;
  --logo-background: #324257;
  --menu-active-bg-color: #337ecc;
  --line-color: #e9e9eb;
  --tabs-background: #474747;
  --login-background2: rgb(64, 158, 255);
  --login-background3: rgb(160, 207, 255);
  --menu-hover-bg-color: #438edc;
}

html.dark {
  --menu-background: #1f1f1f;
  --logo-background: #292929;
  --main-background: #141414;
  --menu-active-bg-color: #595959;
  --menu-hover-bg-color: #000000;
  --header-background: #1f1f1f;
  --line-color: #434343;
  --tabs-background: #474747;
  --login-background2: rgb(38, 38, 38);
  --login-background3: #1f1f1f;

  /*修改elementplus默认暗黑颜色*/
  --el-bg-color: #1f1f1f; /*各组件背景颜色*/
  --el-color-primary: var(--el-color-primary-dark-2);
  --el-color-success: var(--el-color-success-dark-2);
  --el-color-warning: var(--el-color-warning-dark-2);
  --el-color-danger: var(--el-color-danger-dark-2);
  --el-color-error: var(--el-color-error-dark-2);
  --el-color-info: var(--el-color-info-dark-2);
  --el-box-shadow: var(--el-box-shadow-dark);
}

.animated {
  animation-duration: 1.7s;
  animation-fill-mode: both;
}

@keyframes clipRectIn {
  0% {
    clip-path: inset(50% round 10% 50%);
  }
  100% {
    clip-path: inset(0% round 0);
  }
}

.clipRectIn {
  animation-name: clipRectIn;
}
